// 用户页面
import {RoleFormType, RoleVo} from "@/api/sys/admin/role/types";
import {Ref} from "vue";
import {deleteRoleApi, getRoleByIdApi, getRoleListApi, getRoleMenuTreeIdsApi} from "@/api/sys/admin/role";
import {getAllotMenuTreeApi} from "@/api/sys/admin/menu";
import {openConfirm} from "@/components/MyComponent/XMessageBox";
import {DictOptions} from "@/utils/common-types";
import {commonGetOptions} from "@/utils/format-table";
import {initPageQuery} from "@/utils/common-fn";
import {MenuVo} from "@/api/sys/admin/menu/types";

export const useRoleViewStore = defineStore('roleView', () => {

    /**
     * options相关
     */
    const statusOptions: Ref<DictOptions[]> = ref([])
    const menuTypeOptions: Ref<DictOptions[]> = ref([])

    const title = '角色'
    /**
     * table相关
     */
        // table数据
    let tableData: Ref<RoleVo[]> = ref([])
    // 总数
    const total = ref(0)
    // 分页信息,以及查询条件,用于发送api
    const queryData = reactive(initPageQuery<RoleVo>())
    /**
     * 编辑相关
     */
        // 弹出框:编辑
    const editVisible = ref(false)

    // 编辑的表单数据
    const editForm: Ref<RoleFormType> = ref({})


    /**
     * 添加相关
     */
        // 弹出框:编辑
    const addVisible = ref(false)

    // 编辑的表单数据
    const addForm: Ref<RoleFormType> = ref({})
    /**
     * 菜单树相关
     */

        // 菜单可见
    const menuTreeVisible = ref(false)
    // 用户已经拥有的/选中的菜单
    const selectedIds: Ref<number[]> = ref([])
    // 菜单树
    const treeMenus: Ref<MenuVo[]> = ref([])
    // 选中的roleId,用于编辑角色的权限时候选择的
    const selectedRoleId = ref(0)
    // 当前角色
    const displayRole: Ref<RoleFormType> = ref({})
    // 树的引用
    const treeRef = ref<InstanceType<typeof ElTree>>()


    /**
     * 方法相关
     */
    // 设置编辑对话框可见
    function setEditVisible(bolValue: boolean) {
        editVisible.value = bolValue
    }

    // 设置编辑对话框可见
    function setAddVisible(bolValue: boolean) {
        addVisible.value = bolValue
    }

    /**
     * 获取列表
     */
    async function getList() {
        [[tableData.value, total.value], statusOptions.value, menuTypeOptions.value] = await Promise.all(
            [getRoleListApi(queryData),
                ...commonGetOptions('status', 'menu_type')]);
    }

    // 格式化状态
    function formatStatus(row: any, column: any, value: number) {
        if (value === 1) {
            return '正常'
        } else if (value === 0) {
            return '禁用'
        }
        return '异常'
    }

    // 打开 编辑
    async function openEdit(id: number) {
        // 编辑的时候,获取所有的角色
        editForm.value = await getRoleByIdApi(id)
        // roleOptions.value = await getRolesApi();
        editVisible.value = true
    }

    // 删除按钮
    async function openDelete(id: number) {
        if (await openConfirm('确定删除' + title)) {
            await deleteRoleApi(id)
            ElMessage.success('删除成功')
            await getList()
        }
    }

    // 打开 添加
    async function openAdd() {
        // 编辑的时候,获取所有的角色
        addForm.value = {
            name: '',
            code: '',
            sort: 1,
            status: 1,
        }
        // roleOptions.value = await getRolesApi();
        addVisible.value = true
    }

    // 打开菜单树
    async function openMenuTree(id: number) {
        selectedRoleId.value = id;
        // 获取角色拥有的menuIds
        // 和树状菜单列表
        // 获取当前角色的基础信息
        // 获取该菜单下拥有的用户
        [selectedIds.value, treeMenus.value, displayRole.value] =
            await Promise.all([getRoleMenuTreeIdsApi(id), getAllotMenuTreeApi(), getRoleByIdApi(id)])
        menuTreeVisible.value = true
    }

    // table排序
    async function sortTable({prop, order}: {
        prop: string,
        order: 'descending' | 'ascending' | null
    }) {
        if (order === 'descending' || !order) {
            queryData.order = {[prop]: 'desc'}
        } else {
            queryData.order = {[prop]: 'asc'}
        }
        await getList()
    }

    return {
        tableData, queryData, total, treeRef,
        editVisible, editForm, displayRole,
        addForm, addVisible, title, statusOptions,
        menuTreeVisible, selectedIds, treeMenus, selectedRoleId, menuTypeOptions,
        openMenuTree, formatStatus, openEdit, getList, setEditVisible,
        setAddVisible, openAdd, sortTable, openDelete
    }
})